import { View, Text, Image } from '@tarojs/components'
import { AtList, AtListItem } from 'taro-ui'
import Taro from '@tarojs/taro'
import {Component} from "react"
import './indexHostText.less'

export default class indexHostText extends Component {
  moreHotSpotMsg() {
    Taro.navigateTo({
      url: '/pages/host/hostIndex'
    });
  }

  Click(hostid){
    Taro.navigateTo({url:'/pages/host/oneHost'})
  }
  constructor(props){
    super(props),
      this.state={
        hotSpotList: [],
        // 中药常识
        hotSpotMedicineList: [],
        // 热点数据类型
        chooseDataType: '',
        pageNum: '',
        pageSize: 10,
        // 输入框关键字
        keyword: '',
        newPageDataType: ''
      }
  }
  componentDidMount() {
    Taro.request({
      url: 'http://localhost:8080/getAllHost',
      header: {
        'content-type': 'application/json' // 默认值
      },
      method: 'GET',
      dataType: 'json',
      success: (res) => {
        console.log(res.data)
        this.setState({
          hotSpotMedicineList: res.data
        });
        console.log(this.state.hotSpotMedicineList)
      },
      fail: function () {
        Taro.showToast({
          title: '服务器请求错误',
          icon: 'none',
          duration: 3000
        })
      }
    })
  }
  render() {
    return (
      <View>
        <View className='at-row at-col-12 home-hot-title-content'>
          <text className='home-hot-title'>今日热点</text>
          <View className='home-hot-more'>
            <text className='home-hot-more-title' onClick={this.moreHotSpotMsg.bind(this)}>更多</text>
            <View className='at-icon at-icon-chevron-right' />
          </View>
        </View>
        {
          this.state.hotSpotMedicineList.map((hostText, index) => {
            return (
              <View onClick={this.Click.bind(this, hostText.itemID)}>
                <View className='at-row at-col-12'>
                  <View className='at-col at-col-4'>
                    <Image
                      className='hot-item-img'
                      src='https://taro-ui.jd.com/img/logo-taro.png'
                    />
                  </View>
                  <View className='at-col at-col-8 hot-item-text'>
                    <AtList hasBorder={false} key={hostText.itemID}>
                      <AtListItem hasBorder={false} title={hostText.hotspot_TITLE} note={hostText.hotspot_CONTENT}
                                  extraText={hostText.itemCreateAt}/>
                    </AtList>
                  </View>
                </View>
                {
                  (index + 1) == this.state.hotSpotMedicineList.length ?
                    <View className='home-hot-least-title'>
                      <text className='home-hot-least-title-text'>我也是有底线的</text>
                    </View>:''
                }
              </View>
            )
          })
        }
      </View>
    )
  }
}
